<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="layouts/base :: head(~{::title})">
    <title>信息展示</title>
</head>
<body>
    <div id="container">
        <div class="columns is-multiline is-8">
            <div class="column is-one-fifth is-mobile  " th:each="item : ${items}">
                <div class="card">
                    <div >
                        <button class="delete" th:onclick="|document.location.href='@{/items/delete/{id}(id=${item.id})}'|"></button>
                    </div>
                    <div class="card-image">
                        <figure class="image is-4by3">
                            <img th:if="${item.photo != null}" 
                                 th:src="@{'/files/' + ${item.photo}}" 
                                 alt="用户照片" />
                            <img th:unless="${item.photo != null}" 
                                 src="/images/无图片_1762913948.png" 
                                 alt="默认照片" />
                        </figure>
                    </div>
                    <div class="card-content">
                        <div class="media">
                            
                            <div class="media-content">
                                <p class="title is-4" th:text="${item.name}">name</p>
                            </div>
                        </div>

                        <div class="content">
                            <p>年龄: <span th:text="${item.age}">年龄</span></p>
                            <p>性别: <span th:text="${item.sex}">性别</span></p>
                            <p>手机号: <span th:text="${item.phone}">手机号</span></p>
                            <p>邮箱: <span th:text="${item.email}">邮箱</span></p>
                            <p>地址: <span th:text="${item.address}">地址</span></p>
                            <p>云服务器: <span th:text="${#strings.arrayJoin(item.cloudserver, ',')}">云服务器</span></p>
                            <p>工作年数: <span th:text="${item.workYear}">工作年数</span></p>
                            <p>薪资: <span th:text="${item.salary}">薪资</span></p>
                            <p>备注: <span th:text="${item.remark}">备注</span></p>
                            <br />
                        </div>
                    </div>
                        
                </div>
            </div>
        </div>
    </div>
    <footer th:replace="layouts/base :: footer"></footer>
</body>
</html>